<template>
  <div class="tables-container">
    <!-- 第一个表格的信息录入区 -->
    <div class="table-info">
      <div class="info-item">
        <label class="info-label">倒角前日期:</label>
        <input 
          type="date" 
          v-model="table1Info.beforeDate" 
          class="info-input date-input"
        >
      </div>
      <div class="info-item">
        <label class="info-label">倒角前测量人:</label>
        <input 
          type="text" 
          v-model="table1Info.beforeMeasurer" 
          class="info-input"
          placeholder="输入测量人"
        >
      </div>
      <div class="info-item">
        <label class="info-label">倒角后日期:</label>
        <input 
          type="date" 
          v-model="table1Info.afterDate" 
          class="info-input date-input"
        >
      </div>
      <div class="info-item">
        <label class="info-label">倒角后测量人:</label>
        <input 
          type="text" 
          v-model="table1Info.afterMeasurer" 
          class="info-input"
          placeholder="输入测量人"
        >
      </div>
    </div>

    <!-- 第一个表格 -->
    <div class="table-wrapper">
      <div class="table-scroll-container">
        <table border="1" cellpadding="0" cellspacing="0">
          <thead>
            <tr>
              <th 
                :style="{width: columnWidths.table1[0] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="0"
              >
                尺寸型号
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[1] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="1"
              >
                倒角前值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[2] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="2"
              >
                倒角前值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[3] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="3"
              >
                外观1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[4] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="4"
              >
                外观2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[5] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="5"
              >
                倒角后值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[6] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="6"
              >
                倒角后值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[7] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="7"
              >
                倒角下尺寸
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table1[8] + 'px'}" 
                class="resizable-header"
                :data-table="1"
                :data-col="8"
              >
                R值
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
            </tr>
          </thead>
          <tbody>
            <!-- 数据行 -->
            <tr>
              <td :rowspan="tableData1.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData1.sizeModel" 
                  class="cell-input merged-input"
                  placeholder="输入型号"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table1', 0, 'beforeChamfer1')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', 0, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table1', 0, 'beforeChamfer2')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', 0, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table1', 0, 'appearance1')"
                  :ref="(el) => setRef('table1', 0, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table1', 0, 'appearance2')"
                  :ref="(el) => setRef('table1', 0, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table1', 0, 'afterChamfer1')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', 0, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table1', 0, 'afterChamfer2')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', 0, 'afterChamfer2', el)"
                >
              </td>
              <td :rowspan="tableData1.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData1.chamferLower" 
                  class="cell-input merged-input"
                  placeholder="尺寸"
                  :readonly="isChamferLowerAutoCalculated('table1')"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData1[0].rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table1', 0, 'rValue')"
                  :ref="(el) => setRef('table1', 0, 'rValue', el)"
                >
              </td>
            </tr>
            
            <tr v-for="(row, rowIndex) in tableData1.slice(1)" :key="'table1-' + rowIndex">
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'beforeChamfer1')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'beforeChamfer2')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'appearance1')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'appearance2')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'afterChamfer1')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'afterChamfer2')"
                  @input="calculateStatistics('table1')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'afterChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table1', rowIndex + 1, 'rValue')"
                  :ref="(el) => setRef('table1', rowIndex + 1, 'rValue', el)"
                >
              </td>
            </tr>

            <!-- 统计行 -->
            <tr class="stats-row">
              <td></td>
              <td colspan="2" class="before-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table1.before.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table1.before.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table1.before.min }}</span>
                </div>
              </td>
              <td colspan="2"></td>
              <td colspan="2" class="after-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table1.after.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table1.after.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table1.after.min }}</span>
                </div>
              </td>
              <td></td>
              <td></td>
            </tr>
          </tbody>
        </table>
      </div>
      
      <div class="table-actions">
        <button @click="addRow('table1')" class="action-btn add-btn">添加行</button>
        <button @click="removeRow('table1')" class="action-btn remove-btn" :disabled="tableData1.length <= 1">删除最后一行</button>
      </div>
    </div>

    <!-- 第二个表格 -->
    <div class="table-wrapper">
      <div class="table-scroll-container">
        <table border="1" cellpadding="0" cellspacing="0">
          <thead>
            <tr>
              <th 
                :style="{width: columnWidths.table2[0] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="0"
              >
                尺寸型号
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[1] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="1"
              >
                倒角前值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[2] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="2"
              >
                倒角前值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[3] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="3"
              >
                外观1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[4] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="4"
              >
                外观2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[5] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="5"
              >
                倒角后值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[6] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="6"
              >
                倒角后值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[7] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="7"
              >
                倒角下尺寸
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table2[8] + 'px'}" 
                class="resizable-header"
                :data-table="2"
                :data-col="8"
              >
                R值
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
            </tr>
          </thead>
          <tbody>
            <!-- 数据行 -->
            <tr>
              <td :rowspan="tableData2.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData2.sizeModel" 
                  class="cell-input merged-input"
                  placeholder="输入型号"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table2', 0, 'beforeChamfer1')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', 0, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table2', 0, 'beforeChamfer2')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', 0, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table2', 0, 'appearance1')"
                  :ref="(el) => setRef('table2', 0, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table2', 0, 'appearance2')"
                  :ref="(el) => setRef('table2', 0, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table2', 0, 'afterChamfer1')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', 0, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table2', 0, 'afterChamfer2')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', 0, 'afterChamfer2', el)"
                >
              </td>
              <td :rowspan="tableData2.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData2.chamferLower" 
                  class="cell-input merged-input"
                  placeholder="尺寸"
                  :readonly="isChamferLowerAutoCalculated('table2')"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData2[0].rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table2', 0, 'rValue')"
                  :ref="(el) => setRef('table2', 0, 'rValue', el)"
                >
              </td>
            </tr>
            
            <tr v-for="(row, rowIndex) in tableData2.slice(1)" :key="'table2-' + rowIndex">
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'beforeChamfer1')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'beforeChamfer2')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'appearance1')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'appearance2')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'afterChamfer1')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'afterChamfer2')"
                  @input="calculateStatistics('table2')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'afterChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table2', rowIndex + 1, 'rValue')"
                  :ref="(el) => setRef('table2', rowIndex + 1, 'rValue', el)"
                >
              </td>
            </tr>

            <tr class="stats-row">
              <td></td>
              <td colspan="2" class="before-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table2.before.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table2.before.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table2.before.min }}</span>
                </div>
              </td>
              <td colspan="2"></td>
              <td colspan="2" class="after-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table2.after.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table2.after.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table2.after.min }}</span>
                </div>
              </td>
              <td></td>
              <td></td>
            </tr>
          </tbody>
        </table>
      </div>
      
      <div class="table-actions">
        <button @click="addRow('table2')" class="action-btn add-btn">添加行</button>
        <button @click="removeRow('table2')" class="action-btn remove-btn" :disabled="tableData2.length <= 1">删除最后一行</button>
      </div>
    </div>

    <!-- 第三个表格 -->
    <div class="table-wrapper">
      <div class="table-scroll-container">
        <table border="1" cellpadding="0" cellspacing="0">
          <thead>
            <tr>
              <th 
                :style="{width: columnWidths.table3[0] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="0"
              >
                尺寸型号
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[1] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="1"
              >
                倒角前值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[2] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="2"
              >
                倒角前值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[3] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="3"
              >
                外观1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[4] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="4"
              >
                外观2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[5] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="5"
              >
                倒角后值1
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[6] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="6"
              >
                倒角后值2
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[7] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="7"
              >
                倒角下尺寸
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
              <th 
                :style="{width: columnWidths.table3[8] + 'px'}" 
                class="resizable-header"
                :data-table="3"
                :data-col="8"
              >
                R值
                <div class="resize-handle" @mousedown="startResize"></div>
              </th>
            </tr>
          </thead>
          <tbody>
            <!-- 数据行 -->
            <tr>
              <td :rowspan="tableData3.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData3.sizeModel" 
                  class="cell-input merged-input"
                  placeholder="输入型号"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table3', 0, 'beforeChamfer1')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', 0, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table3', 0, 'beforeChamfer2')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', 0, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table3', 0, 'appearance1')"
                  :ref="(el) => setRef('table3', 0, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table3', 0, 'appearance2')"
                  :ref="(el) => setRef('table3', 0, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table3', 0, 'afterChamfer1')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', 0, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table3', 0, 'afterChamfer2')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', 0, 'afterChamfer2', el)"
                >
              </td>
              <td :rowspan="tableData3.length" class="merged-cell">
                <input 
                  type="text" 
                  v-model="mergedData3.chamferLower" 
                  class="cell-input merged-input"
                  placeholder="尺寸"
                  :readonly="isChamferLowerAutoCalculated('table3')"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="tableData3[0].rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table3', 0, 'rValue')"
                  :ref="(el) => setRef('table3', 0, 'rValue', el)"
                >
              </td>
            </tr>
            
            <tr v-for="(row, rowIndex) in tableData3.slice(1)" :key="'table3-' + rowIndex">
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'beforeChamfer1')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'beforeChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.beforeChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'beforeChamfer2')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'beforeChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance1" 
                  class="cell-input"
                  placeholder="外观1"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'appearance1')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'appearance1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.appearance2" 
                  class="cell-input"
                  placeholder="外观2"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'appearance2')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'appearance2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer1" 
                  class="cell-input"
                  placeholder="值1"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'afterChamfer1')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'afterChamfer1', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.afterChamfer2" 
                  class="cell-input"
                  placeholder="值2"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'afterChamfer2')"
                  @input="calculateStatistics('table3')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'afterChamfer2', el)"
                >
              </td>
              <td>
                <input 
                  type="text" 
                  v-model="row.rValue" 
                  class="cell-input"
                  placeholder="R"
                  @keyup.enter="handleEnter('table3', rowIndex + 1, 'rValue')"
                  :ref="(el) => setRef('table3', rowIndex + 1, 'rValue', el)"
                >
              </td>
            </tr>

            <tr class="stats-row">
              <td></td>
              <td colspan="2" class="before-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table3.before.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table3.before.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table3.before.min }}</span>
                </div>
              </td>
              <td colspan="2"></td>
              <td colspan="2" class="after-stats">
                <div class="stat-group">
                  <span class="stat-item">均值: {{ stats.table3.after.mean.toFixed(2) }}</span>
                  <span class="stat-item">最大值: {{ stats.table3.after.max }}</span>
                  <span class="stat-item">最小值: {{ stats.table3.after.min }}</span>
                </div>
              </td>
              <td></td>
              <td></td>
            </tr>
          </tbody>
        </table>
      </div>
      
      <div class="table-actions">
        <button @click="addRow('table3')" class="action-btn add-btn">添加行</button>
        <button @click="removeRow('table3')" class="action-btn remove-btn" :disabled="tableData3.length <= 1">删除最后一行</button>
      </div>
    </div>

    <!-- 底部操作按钮 -->
    <div class="bottom-actions">
      <button @click="saveData" class="bottom-btn save-btn">保存</button>
      <button @click="cancel" class="bottom-btn clear-btn">取消</button>
    </div>
  </div>
</template>

<script>
import { ref, nextTick, onMounted, watch } from 'vue';

export default {
  props: {
    selectedOrder: {
      type: Object,
      default: () => ({}),
      required: false
    },
    editData: {
    type: Object,
    default: null
  }
  },
  setup(props, context) {
    // 存储所有输入框的引用
    const inputRefs = ref({
      table1: {},
      table2: {},
      table3: {}
    });

    // 列宽设置
    const columnWidths = ref({
      table1: [60, 50, 50, 50, 50, 50, 50, 70, 40],
      table2: [60, 50, 50, 50, 50, 50, 50, 70, 40],
      table3: [60, 50, 50, 50, 50, 50, 50, 70, 40]
    });

    // 拖拽状态管理
    const resizeState = ref({
      isResizing: false,
      table: 0,
      col: 0,
      startX: 0,
      startWidth: 0
    });

    // 用于存储保存的数据（包括统计数据）
    const savedData = ref(null);

    // 存储当前统计数据
    const stats = ref({
      table1: {
        before: { mean: 0, max: 0, min: 0 },
        after: { mean: 0, max: 0, min: 0 }
      },
      table2: {
        before: { mean: 0, max: 0, min: 0 },
        after: { mean: 0, max: 0, min: 0 }
      },
      table3: {
        before: { mean: 0, max: 0, min: 0 },
        after: { mean: 0, max: 0, min: 0 }
      }
    });

    // 第一个表格的日期和测量人信息
    const table1Info = ref({
      beforeDate: '',
      beforeMeasurer: '',
      afterDate: '',
      afterMeasurer: ''
    });

    // 设置输入框引用
    const setRef = (tableName, rowIndex, field, el) => {
      if (el) {
        if (!inputRefs.value[tableName][rowIndex]) {
          inputRefs.value[tableName][rowIndex] = {};
        }
        inputRefs.value[tableName][rowIndex][field] = el;
      }
    };

    // 初始化表格数据
    const tableData1 = ref([
      {
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }
    ]);
    const mergedData1 = ref({ sizeModel: '', chamferLower: '' });

    const tableData2 = ref([
      {
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }
    ]);
    const mergedData2 = ref({ sizeModel: '', chamferLower: '' });

    const tableData3 = ref([
      {
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }
    ]);
    const mergedData3 = ref({ sizeModel: '', chamferLower: '' });

    // 计算倒角下尺寸的方法
    const calculateChamferLower = (tableName) => {
      const tableStats = stats.value[tableName];
      const mergedData = tableName === 'table1' ? mergedData1.value : 
                        tableName === 'table2' ? mergedData2.value : mergedData3.value;
      
      // 根据条件计算倒角下尺寸
      if (tableStats.after.mean === 0 || isNaN(tableStats.after.mean)) {
        mergedData.chamferLower = '';
      } else {
        // 倒角下尺寸 = 倒角前均值 - 倒角后均值，保留两位小数
        const value = tableStats.before.mean - tableStats.after.mean;
        mergedData.chamferLower = value.toFixed(2);
      }
    };

    // 判断倒角下尺寸是否应该被自动计算（是否只读）
    const isChamferLowerAutoCalculated = (tableName) => {
      const tableStats = stats.value[tableName];
      return tableStats.after.mean !== 0 && !isNaN(tableStats.after.mean);
    };

    // 初始化数据的方法
    const initData = (order) => {
      // 重置表格数据
      tableData1.value = [{
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }];
      
      tableData2.value = [{
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }];
      
      tableData3.value = [{
        beforeChamfer1: '',
        beforeChamfer2: '',
        appearance1: '',
        appearance2: '',
        afterChamfer1: '',
        afterChamfer2: '',
        rValue: ''
      }];

      // 重置统计数据
      stats.value = {
        table1: {
          before: { mean: 0, max: 0, min: 0 },
          after: { mean: 0, max: 0, min: 0 }
        },
        table2: {
          before: { mean: 0, max: 0, min: 0 },
          after: { mean: 0, max: 0, min: 0 }
        },
        table3: {
          before: { mean: 0, max: 0, min: 0 },
          after: { mean: 0, max: 0, min: 0 }
        }
      };

      // 重置新增的信息字段
      table1Info.value = {
        beforeDate: '',
        beforeMeasurer: '',
        afterDate: '',
        afterMeasurer: ''
      };

      // 重置合并单元格数据
      mergedData1.value = { sizeModel: '', chamferLower: '' };
      mergedData2.value = { sizeModel: '', chamferLower: '' };
      mergedData3.value = { sizeModel: '', chamferLower: '' };
      
      // 填充新的工单数据
      if (order && order.productModel) {
        mergedData1.value.sizeModel = order.productModel;
        mergedData2.value.sizeModel = order.productModel;
        mergedData3.value.sizeModel = order.productModel;
      }
      
      console.log('初始化数据:', order);
    };
    
    // 组件挂载时初始化
    onMounted(() => {
      initData(props.selectedOrder);
      // 初始化时自动聚焦到第一个输入框
      nextTick(() => {
        if (inputRefs.value.table1?.[0]?.beforeChamfer1) {
          inputRefs.value.table1[0].beforeChamfer1.focus();
        }
        if (props.selectedOrder) {
          // 自动填充尺寸型号
          mergedData1.value.sizeModel = props.selectedOrder.productModel || '';
          mergedData2.value.sizeModel = props.selectedOrder.productModel || '';
          mergedData3.value.sizeModel = props.selectedOrder.productModel || '';
        }
        // 如果有编辑数据，进行回显
        if (props.editData) {
        // 回显表格信息
        table1Info.value.beforeDate = props.editData.beforeChamferDate;
        table1Info.value.beforeMeasurer = props.editData.beforeChamferChecker;
        table1Info.value.afterDate = props.editData.afterChamferDate;
        table1Info.value.afterMeasurer = props.editData.afterChamferChecker;
        
        // 回显表格数据
        if (props.editData.tableData1) tableData1.value = [...props.editData.tableData1];
        if (props.editData.tableData2) tableData2.value = [...props.editData.tableData2];
        if (props.editData.tableData3) tableData3.value = [...props.editData.tableData3];
        
        // 回显合并单元格数据
        if (props.editData.mergedData1) mergedData1.value = {...props.editData.mergedData1};
        if (props.editData.mergedData2) mergedData2.value = {...props.editData.mergedData2};
        if (props.editData.mergedData3) mergedData3.value = {...props.editData.mergedData3};
        
        // 计算统计数据
        calculateStatistics('table1');
        calculateStatistics('table2');
        calculateStatistics('table3');
        }
      });
    });
    
    // 监听selectedOrder变化
    watch(
      () => props.selectedOrder,
      (newVal, oldVal) => {
        if (newVal?.productionOrderNo !== oldVal?.productionOrderNo) {
          console.log('工单已变更，重新初始化数据');
          initData(newVal);
        }
      },
      { deep: true }
    );
    
    // 创建新行数据
    const createNewRow = () => ({
      beforeChamfer1: '',
      beforeChamfer2: '',
      appearance1: '',
      appearance2: '',
      afterChamfer1: '',
      afterChamfer2: '',
      rValue: ''
    });

    // 添加新行
    const addRow = (tableName) => {
      if (tableName === 'table1') {
        tableData1.value.push(createNewRow());
      } else if (tableName === 'table2') {
        tableData2.value.push(createNewRow());
      } else if (tableName === 'table3') {
        tableData3.value.push(createNewRow());
      }
      
      nextTick(() => calculateStatistics(tableName));
    };

    // 删除最后一行
    const removeRow = (tableName) => {
      if (tableName === 'table1' && tableData1.value.length > 1) {
        tableData1.value.pop();
      } else if (tableName === 'table2' && tableData2.value.length > 1) {
        tableData2.value.pop();
      } else if (tableName === 'table3' && tableData3.value.length > 1) {
           tableData3.value.pop();
      }
      
      calculateStatistics(tableName);
    };

    // 处理回车键跳转
    const handleEnter = (tableName, rowIndex, field) => {
      // 获取当前表格数据
      const tableData = tableName === 'table1' ? tableData1.value : 
                       tableName === 'table2' ? tableData2.value : tableData3.value;
      
      // 检查是否是最后一行
      if (rowIndex === tableData.length - 1) {
        // 是最后一行，添加新行
        addRow(tableName);
        
        // 等待DOM更新后，将光标定位到新行的相同字段
        nextTick(() => {
          const newRowIndex = tableData.length - 1;
          if (inputRefs.value[tableName]?.[newRowIndex]?.[field]) {
            inputRefs.value[tableName][newRowIndex][field].focus();
          }
        });
      } else {
        // 不是最后一行，移动到下一行的相同字段
        const nextRowIndex = rowIndex + 1;
        if (inputRefs.value[tableName]?.[nextRowIndex]?.[field]) {
          inputRefs.value[tableName][nextRowIndex][field].focus();
        }
      }
    };

    // 计算统计数据，并自动计算倒角下尺寸
    const calculateStatistics = (tableName) => {
      const tableData = tableName === 'table1' ? tableData1.value : 
                       tableName === 'table2' ? tableData2.value : tableData3.value;
      
      // 收集倒角前的值
      const beforeValues = [];
      // 收集倒角后的值
      const afterValues = [];
      
      tableData.forEach(row => {
        // 处理倒角前值
        if (row.beforeChamfer1) beforeValues.push(Number(row.beforeChamfer1));
        if (row.beforeChamfer2) beforeValues.push(Number(row.beforeChamfer2))
        
        // 处理倒角后值
        if (row.afterChamfer1) afterValues.push(Number(row.afterChamfer1));
        if (row.afterChamfer2) afterValues.push(Number(row.afterChamfer2));
      });
      
      // 计算倒角前统计值
      let beforeMean = 0;
      let beforeMax = 0;
      let beforeMin = 0;
      
      if (beforeValues.length > 0) {
        beforeMean = beforeValues.reduce((sum, val) => sum + val, 0) / beforeValues.length;
        beforeMax = Math.max(...beforeValues);
        beforeMin = Math.min(...beforeValues);
      }
      
      // 计算倒角后统计值
      let afterMean = 0;
      let afterMax = 0;
      let afterMin = 0;
      
      if (afterValues.length > 0) {
        afterMean = afterValues.reduce((sum, val) => sum + val, 0) / afterValues.length;
        afterMax = Math.max(...afterValues);
        afterMin = Math.min(...afterValues);
      }
      
      // 更新统计数据
      stats.value[tableName] = {
        before: { mean: beforeMean, max: beforeMax, min: beforeMin },
        after: { mean: afterMean, max: afterMax, min: afterMin }
      };

      // 计算倒角下尺寸
      calculateChamferLower(tableName);
  };

    // 开始调整列宽
    const startResize = (e) => {
      const th = e.target.closest('.resizable-header');
      if (!th) return;
      
      e.preventDefault();
      
      resizeState.value = {
        isResizing: true,
        table: Number(th.dataset.table),
        col: Number(th.dataset.col),
        startX: e.pageX,
        startWidth: th.offsetWidth
      };
      
      // 添加事件监听
      document.addEventListener('mousemove', handleResize);
      document.addEventListener('mouseup', stopResize);
    };

    // 处理调整列宽
    const handleResize = (e) => {
      if (!resizeState.value.isResizing) return;
      
      const width = resizeState.value.startWidth + (e.pageX - resizeState.value.startX);
      // 最小宽度限制
      if (width < 40) return;
      
      const tableKey = `table${resizeState.value.table}`;
      columnWidths.value[tableKey][resizeState.value.col] = width;
    };

    // 停止调整列宽
    const stopResize = () => {
      if (resizeState.value.isResizing) {
        resizeState.value.isResizing = false;
        // 移除事件监听
        document.removeEventListener('mousemove', handleResize);
        document.removeEventListener('mouseup', stopResize);
      }
    };

    // 保存数据
    const saveData = () => {
      const formData = {
        tableData1: tableData1.value,
        tableData2: tableData2.value,
        tableData3: tableData3.value,
        mergedData1: mergedData1.value,
        mergedData2: mergedData2.value,
        mergedData3: mergedData3.value,
        table1Info: table1Info.value,
        productionOrderNo: props.selectedOrder?.productionOrderNo || ''
      };
      savedData.value = formData;
      context.emit('save', formData);
    };

    // 取消（清空）
    const cancel = () => {
      if (confirm('确定要清空所有数据吗？')) {
        // 重置表格数据
        tableData1.value = [createNewRow()];
        mergedData1.value = { sizeModel: '', chamferLower: '' };
        
        tableData2.value = [createNewRow()];
        mergedData2.value = { sizeModel: '', chamferLower: '' };
        
        tableData3.value = [createNewRow()];
        mergedData3.value = { sizeModel: '', chamferLower: '' };
        
        // 重置统计数据
        stats.value = {
          table1: {
            before: { mean: 0, max: 0, min: 0 },
            after: { mean: 0, max: 0, min: 0 }
          },
          table2: {
            before: { mean: 0, max: 0, min: 0 },
            after: { mean: 0, max: 0, min: 0 }
          },
          table3: {
            before: { mean: 0, max: 0, min: 0 },
            after: { mean: 0, max: 0, min: 0 }
          }
        };

        // 重置新增的信息字段
        table1Info.value = {
          beforeDate: '',
          beforeMeasurer: '',
          afterDate: '',
          afterMeasurer: ''
        };
        
        context.emit('cancel');
      }
    };

    return {
      columnWidths,
      resizeState,
      stats,
      tableData1,
      mergedData1,
      tableData2,
      mergedData2,
      tableData3,
      mergedData3,
      table1Info,
      inputRefs,
      setRef,
      addRow,
      removeRow,
      handleEnter,
      calculateStatistics,
      startResize,
      handleResize,
      stopResize,
      saveData,
      cancel,
      isChamferLowerAutoCalculated
    };
  }
};
</script>

<style>
.tables-container {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 表格信息区域样式 */
.table-info {
  display: flex;
  gap: 20px;
  padding: 15px;
  background-color: #f9f9f9;
  border-radius: 4px;
  border: 1px solid #ccc;
  flex-wrap: wrap; /* 允许在小屏幕上换行 */
}

.info-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.info-label {
  font-weight: 500;
  min-width: 90px;
}

.info-input {
  padding: 6px 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 14px;
}

.date-input {
  width: 160px;
}

.table-wrapper {
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow: hidden;
}

.table-scroll-container {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

th, td {
  padding: 8px;
  text-align: center;
  border: 1px solid #ccc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

th {
  background-color: #f5f5f5;
  position: relative;
  user-select: none;
}

.resizable-header {
  position: relative;
}

.resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  width: 5px;
  height: 100%;
  cursor: col-resize;
  background-color: transparent;
}

.resize-handle:hover {
  background-color: #666;
}

.cell-input {
  width: 100%;
  padding: 6px 4px;
  border: 1px solid #ddd;
  border-radius: 2px;
  box-sizing: border-box;
  text-align: center;
}

/* 只读状态的输入框样式 */
.cell-input[readonly] {
  background-color: #f9f9f9;
  color: #333;
  font-weight: 500;
}

.cell-input:focus {
  outline: none;
  border-color: #42b983;
  box-shadow: 0 0 0 2px rgba(66, 185, 131, 0.2);
}

.merged-cell {
  vertical-align: middle;
}

.merged-input {
  height: 100%;
  min-height: 40px;
}

.table-actions {
  display: flex;
  justify-content: flex-end;
  padding: 10px;
  background-color: #f9f9f9;
  border-top: 1px solid #ccc;
}

.action-btn {
  margin-left: 10px;
  padding: 6px 12px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.add-btn {
  background-color: #42b983;
  color: white;
}

.add-btn:hover {
  background-color: #359e6d;
}

.remove-btn {
  background-color: #f44336;
  color: white;
}

.remove-btn:hover {
  background-color: #d32f2f;
}

.remove-btn:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
}

.stats-row {
  background-color: #f0f8ff;
}

.stat-group {
  display: flex;
  justify-content: space-around;
  gap: 10px;
}

.stat-item {
  font-size: 12px;
}

.bottom-actions {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 20px;
}

.bottom-btn {
  padding: 10px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: background-color 0.2s;
}

.save-btn {
  background-color: #42b983;
  color: white;
}

.save-btn:hover {
  background-color: #359e6d;
}

.clear-btn {
  background-color: #f44336;
  color: white;
}

.clear-btn:hover {
  background-color: #d32f2f;
}
</style>
